<script setup>
import { ref } from 'vue'
import useAuthStore from '@/store/auth'
import { useRoute, useRouter } from 'vue-router'
import UploadImage from '@/components/uploadImage.vue'
import api from '@/api'
import { Message } from '@arco-design/web-vue'

const authStore = useAuthStore()
const $route = useRoute()
const $router = useRouter()

const number = authStore.company.number
const formData = ref({
  name: '',
  logo: '',
})

const getEnterpriseInfo = async () => {
  try {
    const res = await api.get('auth/company/' + number)
    formData.value = res.data
  } catch (_) {}
}

const formSubmit = async () => {
  console.log('formSubmit', formData.value)
  var obj = { ...formData.value }
  if (!obj.name) {
    Message.error('企业名称不可为空')
    return false
  }
  if (!obj.logo) {
    Message.error('企业logo不可为空')
    return false
  }
  try {
    const res = await api.post('system/base/updateCompanyData', obj)
    Message.success(res.message)
  } catch (error) {
    console.error('error', error)
    return false
  }
}

getEnterpriseInfo()
</script>

<template>
  <div class="page">
    <div class="form_body">
      <div class="flex at_c jc_b mb20">
        <div class="form_body_title">企业基本信息设置</div>
      </div>

      <a-form>
        <a-row class="grid-demo" :gutter="24">
          <a-col :span="12">
            <a-form-item label="企业名称">
              <a-input
                :style="{ width: '400px' }"
                v-model="formData.name"
                placeholder="请输入企业名称"
                allow-clear
              ></a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row class="grid-demo" :gutter="24">
          <a-col :span="12">
            <a-form-item label="企业logo">
              <UploadImage width="200px" height="200px" v-model="formData.logo"></UploadImage>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row class="grid-demo" :gutter="24">
          <a-col :span="12">
            <a-form-item label="">
              <a-button @click="formSubmit" type="primary">保存</a-button>
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>
    </div>
  </div>
</template>

<style scoped>
.page {
  height: 100%;
  padding: 20px;
  box-sizing: border-box;
}

.header {
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.form_body {
  box-sizing: border-box;
  padding: 20px 24px;
  background-color: #fff;
  margin-bottom: 20px;
}

.form_body_title {
  font-size: 18px;
  font-weight: bold;
}
</style>
